<template>
  <Echarts :options="options" id="leftThridChart"></Echarts>
</template>

<script>
import Echarts from "@/components/Echarts/index.vue";
import { reactive, watch } from "vue";

export default {
  components: {
    Echarts
  },
  props: {
    chartData: {
      type: Array,
      default: []
    }
  },
  setup(props) {
    let options = reactive({
      grid: {
        top: "10%",
        left: "3%",
        right: "4%",
        bottom: "3%",
        containLabel: true
      },
      xAxis: {
        type: "category",
        data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"]
      },
      yAxis: {
        type: "value"
      },
      series: [
        {
          data: props.chartData,
          type: "bar"
        }
      ]
    });
    return {
      options
    };
  }
};
</script>